<template>
  <el-card class="box-card">
    <el-form :inline="true">
      <el-form-item label="物业人员名称">
        <el-input placeholder="请输入物业人员" style="width:200px" />
      </el-form-item>
      <el-form-item label="签到状态">
        <el-select placeholder="请选择">
          <el-option label="文本类型" value="shanghai" />
          <el-option label="链接类型" value="beijing" />
        </el-select>
      </el-form-item>
      <el-form-item label="签退状态">
        <el-select placeholder="请选择">
          <el-option label="文本类型" value="shanghai" />
          <el-option label="链接类型" value="beijing" />
        </el-select>
      </el-form-item>
      <el-form-item label="所属小区">
        <el-select placeholder="请选择">
          <el-option label="文本类型" value="shanghai" />
          <el-option label="链接类型" value="beijing" />
        </el-select>
      </el-form-item>
    </el-form>
    <!-- 按钮 -->
    <el-row>
      <el-button type="info">搜索</el-button>

      <el-button type="success">导出</el-button>
    </el-row>

    <!-- 表格 -->
    <!-- 表格 -->
    <el-table border class="table-item">
      <!-- 复选框 -->
      <el-table-column
        type="selection"
        width="55"
      />
      <!--  -->
      <el-table-column
        label="社区名"
      />
      <el-table-column
        label="签到人员"
      />
      <el-table-column
        label="部门"
      />
      <el-table-column
        label="职位"
      />
      <el-table-column
        label="签到地点"
      />
      <el-table-column
        label="签到时间"
      />
      <el-table-column
        label="签到状态"
      >

        <el-button type="success">默认</el-button>

      </el-table-column>
      <el-table-column
        label="签退地点"
      />
      <el-table-column
        label="签退时间"
      />
      <el-table-column
        label="签退状态"
      />

    </el-table>

    <!-- 分页 -->
    <el-pagination
      class="el-page"
      :current-page="page.page"
      :page-sizes="[100, 200, 300, 400]"
      :page-size="page.size"
      layout="total, sizes, prev, pager, next, jumper"
      :total="page.tatal"
    />

  </el-card>

</template>
<script>
export default {
  data() {
    return {
      page: {
        page: 1, // 当前页码
        size: 10,
        total: 0 // 总数
      }
    }
  }

}
</script>
<style scopde>
.box-card{
  margin: 20px 20px;
}
.el-page{
  float: right;
   margin: 20px 0;
}
.table-item{
   margin-top: 40px;
}

</style>
